<div class="overflow-hidden content-margin" style="width: 50%;">

    <form [formGroup]="formGroup">

        <dynamic-foundation-form [group]="formGroup"
                                 [layout]="formLayout"
                                 [model]="formModel"
                                 (blur)="onBlur($event)"
                                 (change)="onChange($event)"
                                 (focus)="onFocus($event)">

            <ng-template modelId="foundationFormArray" let-context="context" let-index="index">

                <div class="small-5 cell">

                    <button type="button" class="button alert rounded" (click)="remove(context, index)">&#10005;</button>
                    <button type="button" class="button primary rounded" (click)="move(context, index, -1)">&#9650;</button>
                    <button type="button" class="button primary rounded" (click)="move(context, index, 1)">&#9660;</button>
                    <button type="button" class="button success rounded" (click)="insert(context, index + 1)">&#43;</button>

                </div>

            </ng-template>

        </dynamic-foundation-form>

    </form>

    <pre>{{formGroup.value | json}}</pre>

</div>